import 'package:flutter/material.dart';
import 'package:flutter/services.dart' show rootBundle;
import 'package:web_socket_channel/web_socket_channel.dart';
import 'package:flutter_spinkit/flutter_spinkit.dart';
import 'package:rjpb/page/home/fireAlarm/controller/fireAlarm_page_controller.dart';
import 'package:get/get.dart';
// import 'package:rjpb/page/home/inspection/widgets/IndpectionListItem.dart';
import 'package:rjpb/page/home/fireAlarm/widgets/menu_svg_view.dart';
import 'package:rjpb/components/z_icons/z_empty.dart';

import 'package:flutter_svg/flutter_svg.dart';
import 'package:rjpb/shared/extensions/extensions.dart';
import 'package:rjpb/components/gap.dart';

class FireAlarmPage extends StatefulWidget {
  @override
  _FireAlarmPage createState() => _FireAlarmPage();
}

class _FireAlarmPage extends State<FireAlarmPage> {
  final FireAlarmPageController _FireAlarmPageController =
      Get.put(FireAlarmPageController());

  @override
  void initState() {
    super.initState();
    // _FireAlarmPageController.loadInitialData();
    // // 加载菜单数据
    // _FireAlarmPageController.loadMenuData();
    WidgetsBinding.instance.addPostFrameCallback((_) {
      _FireAlarmPageController.loadInitialData();
      _FireAlarmPageController.loadMenuData();
    });
  }

  //左侧下面
  // Widget _buildTabContent(String tab) {
  //   return Obx(() {
  //     if (_FireAlarmPageController.isLoading.value) {
  //       return Center(child: CircularProgressIndicator());
  //     }

  //     if (_FireAlarmPageController.rows.isEmpty) {
  //       return ZEmpty(
  //         gapH: 0,
  //         width: double.infinity,
  //         height: double.infinity,
  //       );
  //     }

  //     return RefreshIndicator(
  //       onRefresh: () async {
  //         await _FireAlarmPageController.refreshTabData(tab);
  //       },
  //       child: NotificationListener<ScrollNotification>(
  //         onNotification: (scrollNotification) {
  //           if (scrollNotification is ScrollEndNotification &&
  //               scrollNotification.metrics.pixels ==
  //                   scrollNotification.metrics.maxScrollExtent) {
  //             _FireAlarmPageController.loadMoreTabData(tab);
  //           }
  //           return false;
  //         },
  //         child: ListView.builder(
  //           padding: const EdgeInsets.all(10.0),
  //           itemCount: _FireAlarmPageController.rows.length,
  //           itemBuilder: (context, index) {
  //             final row = _FireAlarmPageController.rows[index];
  //             final isRealtime = row['isRealtime'] == 1;

  //             return Card(
  //               color: isRealtime ? Colors.red.shade50 : Colors.white,
  //               elevation: isRealtime ? 5 : 2,
  //               margin: const EdgeInsets.symmetric(vertical: 8),
  //               child: ListTile(
  //                 title: Text(
  //                   "时间: ${row['createTime']}",
  //                   style: TextStyle(
  //                     fontWeight:
  //                         isRealtime ? FontWeight.bold : FontWeight.normal,
  //                     color: isRealtime ? Colors.red : Colors.black,
  //                   ),
  //                 ),
  //                 subtitle: Column(
  //                   crossAxisAlignment: CrossAxisAlignment.start,
  //                   children: [
  //                     Text("状态: ${row['status']}"),
  //                     Text(
  //                         "点号: ${row['machineNum']}-${row['loopNum']}-${row['dotNum']}"),
  //                     Text("类型: ${row['type']}"),
  //                     Text("所属部门: ${row['location']}"),
  //                     Text("点位描述: ${row['locDotName']}"),
  //                   ],
  //                 ),
  //               ),
  //             );
  //           },
  //         ),
  //       ),
  //     );
  //   });
  // }

  Widget _buildTabContent(String tab) {
    return Obx(() {
      if (_FireAlarmPageController.isLoading.value) {
        return Center(
          child: CircularProgressIndicator(
            valueColor: AlwaysStoppedAnimation<Color>(Colors.blue.shade600),
          ),
        );
      }

      if (_FireAlarmPageController.rows.isEmpty) {
        print("rows 数据为空，显示 ZEmpty 组件");
        return ZEmpty(
          gapH: 0,
          width: double.infinity,
          height: double.infinity,
        );
      }

      return RefreshIndicator(
        color: Colors.blue.shade600,
        onRefresh: () async {
          await _FireAlarmPageController.refreshTabData(tab);
        },
        child: NotificationListener<ScrollNotification>(
          onNotification: (scrollNotification) {
            if (scrollNotification is ScrollEndNotification &&
                scrollNotification.metrics.pixels ==
                    scrollNotification.metrics.maxScrollExtent) {
              _FireAlarmPageController.loadMoreTabData(tab);
            }
            return false;
          },
          child: ListView.builder(
            padding: const EdgeInsets.all(12.0),
            itemCount: _FireAlarmPageController.rows.length,
            itemBuilder: (context, index) {
              final row = _FireAlarmPageController.rows[index];
              final isRealtime = row['isRealtime'] == 1;

              // 实时报警的闪烁动画
              final animation = AlwaysStoppedAnimation(
                  isRealtime ? Colors.red.shade100 : Colors.transparent);

              return AnimatedBuilder(
                animation: animation,
                builder: (context, child) {
                  return Container(
                    margin: EdgeInsets.symmetric(vertical: 6, horizontal: 8),
                    decoration: BoxDecoration(
                      borderRadius: BorderRadius.circular(12),
                      color: animation.value,
                      boxShadow: [
                        BoxShadow(
                          color: Colors.black.withOpacity(0.1),
                          blurRadius: 6,
                          spreadRadius: 1,
                          offset: Offset(0, 2),
                        ),
                      ],
                    ),
                    child: Card(
                      elevation: 0,
                      margin: EdgeInsets.zero,
                      shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.circular(12),
                      ),
                      color: isRealtime ? Colors.red.shade50 : Colors.white,
                      child: InkWell(
                        borderRadius: BorderRadius.circular(12),
                        onTap: () {
                          // 点击事件处理
                          final cardId = row['id']; // 假设每条记录的 id 存在 row['id']
                          final loopNum = row['loopNum']; // 获取 loopNum
                          final dotNum = row['dotNum']; // 获取 dotNum
                          print(
                              '点击的卡片 ID: $cardId, loopNum: $loopNum, dotNum: $dotNum');
                          _FireAlarmPageController.onCardTap(
                              cardId, loopNum, dotNum); // 调用控制器方法
                        },
                        child: Padding(
                          padding: EdgeInsets.all(16),
                          child: Column(
                            crossAxisAlignment: CrossAxisAlignment.start,
                            children: [
                              // 修复后的时间行（带图标）
                              Row(
                                crossAxisAlignment: CrossAxisAlignment.start,
                                mainAxisSize:
                                    MainAxisSize.min, // 关键修复：让Row只占用必要宽度
                                children: [
                                  Padding(
                                    padding: const EdgeInsets.only(right: 8.0),
                                    child: Icon(
                                      Icons.access_time,
                                      size: 16,
                                      color: isRealtime
                                          ? Colors.red.shade800
                                          : Colors.grey.shade600,
                                    ),
                                  ),
                                  Flexible(
                                    // 使用Flexible确保文本可以换行
                                    child: Text(
                                      row['reportTime'],
                                      style: TextStyle(
                                        fontWeight: FontWeight.w600,
                                        color: isRealtime
                                            ? Colors.red.shade800
                                            : Colors.grey.shade800,
                                        fontSize: 14,
                                      ),
                                      softWrap: true,
                                    ),
                                  ),
                                ],
                              ),
                              SizedBox(height: 12),

                              // 其他信息项保持不变...
                              _buildInfoRow(
                                  Icons.check_circle, "状态: ${row['infoCode']}"),
                              _buildInfoRow(
                                  Icons.location_on, "位置: ${row['location']}"),
                              _buildInfoRow(
                                  Icons.description, "描述: ${row['descrtion']}"),
                              _buildInfoRow(Icons.settings,
                                  "点号: ${row['machineNum']}-${row['loopNum']}-${row['dotNum']}"),
                              _buildInfoRow(
                                  Icons.category, "类型: ${row['type']}"),

                              if (isRealtime)
                                Padding(
                                  padding: EdgeInsets.only(top: 8),
                                  child: Row(
                                    children: [
                                      Icon(Icons.warning_amber_rounded,
                                          color: Colors.red, size: 16),
                                      SizedBox(width: 4),
                                      Text("实时报警中",
                                          style: TextStyle(
                                            color: Colors.red,
                                            fontWeight: FontWeight.bold,
                                            fontSize: 12,
                                          )),
                                    ],
                                  ),
                                ),
                            ],
                          ),
                        ),
                      ),
                    ),
                  );
                },
              );
            },
          ),
        ),
      );
    });
  }

// 辅助方法：构建带图标的信息行
  Widget _buildInfoRow(IconData icon, String text) {
    return Padding(
      padding: EdgeInsets.symmetric(vertical: 4),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Icon(
            icon,
            size: 16,
            color: Colors.grey.shade600,
          ),
          SizedBox(width: 8),
          Expanded(
            child: Text(
              text,
              style: TextStyle(
                fontSize: 13,
                color: Colors.grey.shade800,
              ),
            ),
          ),
        ],
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        // child: Row(
        //   children: [
        //     // 左侧 UI
        //     Expanded(
        //       flex: 2,
        //       child: Column(
        //         children: [
        //           Expanded(
        //             flex: 1,
        //             child: Row(
        //               children: [
        //                 Expanded(
        //                   child: GestureDetector(
        //                     // onTap: () {
        //                     //   showDeviceListDialog(
        //                     //       getOfflineDevices(), '设备离线列表');
        //                     // },
        //                     child: Stack(
        //                       children: [
        //                         Container(
        //                           decoration: BoxDecoration(
        //                             borderRadius: BorderRadius.circular(10),
        //                             image: DecorationImage(
        //                               image: AssetImage(
        //                                   'assets/index_topLeft.png'),
        //                               fit: BoxFit.fill,
        //                             ),
        //                           ),
        //                           child: Container(
        //                             padding: EdgeInsets.all(16),
        //                             child: Column(
        //                               mainAxisAlignment:
        //                                   MainAxisAlignment.center,
        //                               children: [
        //                                 Text(
        //                                   '今日火警',
        //                                   style: TextStyle(
        //                                     fontSize: 16,
        //                                     fontWeight: FontWeight.bold,
        //                                     color: Colors.black,
        //                                   ),
        //                                 ),
        //                                 SizedBox(height: 8),
        //                                 Obx(() => Text(
        //                                       '${_FireAlarmPageController.todayFireCount.value}',
        //                                       style: TextStyle(
        //                                         fontSize: 24,
        //                                         fontWeight: FontWeight.bold,
        //                                         color: Colors.red,
        //                                       ),
        //                                     )),
        //                               ],
        //                             ),
        //                           ),
        //                         ),
        //                         Positioned(
        //                           top: 12,
        //                           right: 14,
        //                           child: Padding(
        //                             padding: const EdgeInsets.all(4.0),
        //                             child: Image.asset(
        //                               'assets/fire.png', // 替换为你的火警图标路径
        //                               width: 30,
        //                               height: 30,
        //                             ),
        //                           ),
        //                         ),
        //                       ],
        //                     ),
        //                   ),
        //                 ),
        //                 SizedBox(width: 8),
        //                 Expanded(
        //                   child: GestureDetector(
        //                     // onTap: () {
        //                     //   showDeviceListDialog(
        //                     //       getAbnormalPortDevices(), '串口异常列表');
        //                     // },
        //                     child: Stack(
        //                       children: [
        //                         Container(
        //                           decoration: BoxDecoration(
        //                             borderRadius: BorderRadius.circular(10),
        //                             image: DecorationImage(
        //                               image: AssetImage(
        //                                   'assets/index_topRight.png'),
        //                               fit: BoxFit.fill,
        //                             ),
        //                           ),
        //                           child: Container(
        //                             padding: EdgeInsets.all(16),
        //                             child: Column(
        //                               mainAxisAlignment:
        //                                   MainAxisAlignment.center,
        //                               children: [
        //                                 Text(
        //                                   '点位数量',
        //                                   style: TextStyle(
        //                                     fontSize: 16,
        //                                     fontWeight: FontWeight.bold,
        //                                     color: Colors.black,
        //                                   ),
        //                                 ),
        //                                 SizedBox(height: 8),
        //                                 Obx(() => Text(
        //                                       '${_FireAlarmPageController.PortCount.value}',
        //                                       style: TextStyle(
        //                                         fontSize: 24,
        //                                         fontWeight: FontWeight.bold,
        //                                         color: Colors.orange,
        //                                       ),
        //                                     )),
        //                               ],
        //                             ),
        //                           ),
        //                         ),
        //                         Positioned(
        //                           top: 12,
        //                           right: 14,
        //                           child: Padding(
        //                             padding: const EdgeInsets.all(4.0),
        //                             child: Image.asset(
        //                               'assets/dot.png', // 替换为你的火警图标路径
        //                               width: 28,
        //                               height: 28,
        //                             ),
        //                           ),
        //                         ),
        //                       ],
        //                     ),
        //                   ),
        //                 ),
        //               ],
        //             ),
        //           ),
        //           SizedBox(height: 16),
        //           Expanded(
        //             flex: 2,
        //             child: Container(
        //               decoration: BoxDecoration(
        //                 borderRadius: BorderRadius.circular(10),
        //                 color: Colors.white,
        //                 boxShadow: [
        //                   BoxShadow(
        //                     color: Colors.black12,
        //                     blurRadius: 5,
        //                     spreadRadius: 2,
        //                   ),
        //                 ],
        //               ),
        //               child: DefaultTabController(
        //                 length: 4,
        //                 child: Column(
        //                   children: [
        //                     // 美化后的TabBar
        //                     Container(
        //                       decoration: BoxDecoration(
        //                         borderRadius: BorderRadius.vertical(
        //                             top: Radius.circular(10)),
        //                         color: Colors.white,
        //                       ),
        //                       child: TabBar(
        //                         // isScrollable: true, // 确保可以横向滚动
        //                         labelColor: Colors.blue.shade800,
        //                         unselectedLabelColor: Colors.grey.shade600,
        //                         indicator: UnderlineTabIndicator(
        //                           borderSide: BorderSide(
        //                             width: 3.0,
        //                             color: Colors.blue.shade600,
        //                           ),
        //                           insets:
        //                               EdgeInsets.symmetric(horizontal: 16.0),
        //                         ),
        //                         labelStyle: TextStyle(
        //                           fontWeight: FontWeight.bold,
        //                           fontSize: 10,
        //                         ),
        //                         unselectedLabelStyle: TextStyle(
        //                           fontWeight: FontWeight.normal,
        //                           fontSize: 10,
        //                         ),
        //                         tabs: [
        //                           Tab(text: '火警'),
        //                           Tab(text: '故障'),
        //                           Tab(text: '监管'),
        //                           Tab(text: '反馈'),
        //                         ],
        //                         onTap: (index) {
        //                           const tabs = ['火警', '故障', '监管', '反馈'];
        //                           _FireAlarmPageController.onTabChanged(
        //                               tabs[index]);
        //                         },
        //                       ),
        //                     ),

        //                     Expanded(
        //                       child: TabBarView(
        //                         children: [
        //                           _buildTabContent('火警'),
        //                           _buildTabContent('故障'),
        //                           _buildTabContent('监管'),
        //                           _buildTabContent('反馈'),
        //                         ],
        //                       ),
        //                     ),
        //                   ],
        //                 ),
        //               ),
        //             ),
        //           ),
        //         ],
        //       ),
        //     ),
        //     SizedBox(width: 16),

        //     Expanded(
        //       flex: 7,
        //       child: Obx(() {
        //         // 监听菜单数据加载状态
        //         if (_FireAlarmPageController.isLoading.value) {
        //           return Center(
        //             child: CircularProgressIndicator(),
        //           );
        //         }

        //         // return MenuSvgLayout(
        //         //   menuData: _FireAlarmPageController.menuData,
        //         //   onMenuItemSelected: (id) {
        //         //     // 处理菜单项选中逻辑
        //         //     _FireAlarmPageController.onMenuItemSelected(id);
        //         //   },
        //         // );
        //         return Stack(
        //           children: [
        //             // SVG 图展示区域
        //             MenuSvgLayout(
        //               menuData: _FireAlarmPageController.menuData,
        //               onMenuItemSelected: (id) {
        //                 // 处理菜单项选中逻辑
        //                 _FireAlarmPageController.onMenuItemSelected(id);
        //               },
        //             ),
        //             // 自定义 loading 效果
        //             if (_FireAlarmPageController.isLoadingCardTap.value)
        //               Container(
        //                 color: Colors.black.withOpacity(0.5), // 半透明背景
        //                 child: Center(
        //                   child: Column(
        //                     mainAxisAlignment: MainAxisAlignment.center,
        //                     children: [
        //                       SizedBox(
        //                         width: 80,
        //                         height: 80,
        //                         child: Image.asset(
        //                             'assets/loading.gif'), // 自定义 loading 动画
        //                       ),
        //                       SizedBox(height: 16),
        //                       Text(
        //                         '正在查找报警点...',
        //                         style: TextStyle(
        //                           fontSize: 16,
        //                           color: Colors.white,
        //                         ),
        //                       ),
        //                     ],
        //                   ),
        //                 ),
        //               ),
        //           ],
        //         );
        //       }),
        //     ),
        //   ],
        // ),
        child: Stack(
          children: [
            Row(
              children: [
                // 左侧 UI
                Expanded(
                  flex: 2,
                  child: Column(
                    children: [
                      Expanded(
                        flex: 1,
                        child: Row(
                          children: [
                            Expanded(
                              child: GestureDetector(
                                // onTap: () {
                                //   showDeviceListDialog(
                                //       getOfflineDevices(), '设备离线列表');
                                // },
                                child: Stack(
                                  children: [
                                    Container(
                                      decoration: BoxDecoration(
                                        borderRadius: BorderRadius.circular(10),
                                        image: DecorationImage(
                                          image: AssetImage(
                                              'assets/index_topLeft.png'),
                                          fit: BoxFit.fill,
                                        ),
                                      ),
                                      child: Container(
                                        padding: EdgeInsets.all(16),
                                        child: Column(
                                          mainAxisAlignment:
                                              MainAxisAlignment.center,
                                          children: [
                                            Text(
                                              '今日火警',
                                              style: TextStyle(
                                                fontSize: 16,
                                                fontWeight: FontWeight.bold,
                                                color: Colors.black,
                                              ),
                                            ),
                                            SizedBox(height: 8),
                                            Obx(() => Text(
                                                  '${_FireAlarmPageController.todayFireCount.value}',
                                                  style: TextStyle(
                                                    fontSize: 24,
                                                    fontWeight: FontWeight.bold,
                                                    color: Colors.red,
                                                  ),
                                                )),
                                          ],
                                        ),
                                      ),
                                    ),
                                    Positioned(
                                      top: 12,
                                      right: 18,
                                      child: Padding(
                                        padding: const EdgeInsets.all(4.0),
                                        child: Image.asset(
                                          'assets/fire.png', // 替换为你的火警图标路径
                                          width: 30,
                                          height: 30,
                                        ),
                                      ),
                                    ),
                                  ],
                                ),
                              ),
                            ),
                            SizedBox(width: 8),
                            Expanded(
                              child: GestureDetector(
                                // onTap: () {
                                //   showDeviceListDialog(
                                //       getAbnormalPortDevices(), '串口异常列表');
                                // },
                                child: Stack(
                                  children: [
                                    Container(
                                      decoration: BoxDecoration(
                                        borderRadius: BorderRadius.circular(10),
                                        image: DecorationImage(
                                          image: AssetImage(
                                              'assets/index_topRight.png'),
                                          fit: BoxFit.fill,
                                        ),
                                      ),
                                      child: Container(
                                        padding: EdgeInsets.all(16),
                                        child: Column(
                                          mainAxisAlignment:
                                              MainAxisAlignment.center,
                                          children: [
                                            Text(
                                              '点位数量',
                                              style: TextStyle(
                                                fontSize: 16,
                                                fontWeight: FontWeight.bold,
                                                color: Colors.black,
                                              ),
                                            ),
                                            SizedBox(height: 8),
                                            Obx(() => Text(
                                                  '${_FireAlarmPageController.PortCount.value}',
                                                  style: TextStyle(
                                                    fontSize: 24,
                                                    fontWeight: FontWeight.bold,
                                                    color: Colors.orange,
                                                  ),
                                                )),
                                          ],
                                        ),
                                      ),
                                    ),
                                    Positioned(
                                      top: 12,
                                      right: 18,
                                      child: Padding(
                                        padding: const EdgeInsets.all(4.0),
                                        child: Image.asset(
                                          'assets/dot.png', // 替换为你的火警图标路径
                                          width: 28,
                                          height: 28,
                                        ),
                                      ),
                                    ),
                                  ],
                                ),
                              ),
                            ),
                          ],
                        ),
                      ),
                      SizedBox(height: 16),
                      Expanded(
                        flex: 2,
                        child: Container(
                          decoration: BoxDecoration(
                            borderRadius: BorderRadius.circular(10),
                            color: Colors.white,
                            boxShadow: [
                              BoxShadow(
                                color: Colors.black12,
                                blurRadius: 5,
                                spreadRadius: 2,
                              ),
                            ],
                          ),
                          child: DefaultTabController(
                            length: 4,
                            child: Column(
                              children: [
                                // 美化后的TabBar
                                Container(
                                  decoration: BoxDecoration(
                                    borderRadius: BorderRadius.vertical(
                                        top: Radius.circular(10)),
                                    color: Colors.white,
                                  ),
                                  child: TabBar(
                                    // isScrollable: true, // 确保可以横向滚动
                                    labelColor: Colors.blue.shade800,
                                    unselectedLabelColor: Colors.grey.shade600,
                                    indicator: UnderlineTabIndicator(
                                      borderSide: BorderSide(
                                        width: 3.0,
                                        color: Colors.blue.shade600,
                                      ),
                                      insets: EdgeInsets.symmetric(
                                          horizontal: 16.0),
                                    ),
                                    labelStyle: TextStyle(
                                      fontWeight: FontWeight.bold,
                                      fontSize: 10,
                                    ),
                                    unselectedLabelStyle: TextStyle(
                                      fontWeight: FontWeight.normal,
                                      fontSize: 10,
                                    ),
                                    tabs: [
                                      Tab(text: '火警'),
                                      Tab(text: '故障'),
                                      Tab(text: '监管'),
                                      Tab(text: '反馈'),
                                    ],
                                    onTap: (index) {
                                      const tabs = ['火警', '故障', '监管', '反馈'];
                                      _FireAlarmPageController.onTabChanged(
                                          tabs[index]);
                                    },
                                  ),
                                ),

                                Expanded(
                                  child: TabBarView(
                                    children: [
                                      _buildTabContent('火警'),
                                      _buildTabContent('故障'),
                                      _buildTabContent('监管'),
                                      _buildTabContent('反馈'),
                                    ],
                                  ),
                                ),
                              ],
                            ),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
                SizedBox(width: 16),

                Expanded(
                  flex: 7,
                  child: Obx(() {
                    // 监听菜单数据加载状态
                    if (_FireAlarmPageController.isLoading.value) {
                      return Center(
                        child: CircularProgressIndicator(),
                      );
                    }

                    // return MenuSvgLayout(
                    //   menuData: _FireAlarmPageController.menuData,
                    //   onMenuItemSelected: (id) {
                    //     // 处理菜单项选中逻辑
                    //     _FireAlarmPageController.onMenuItemSelected(id);
                    //   },
                    // );
                    return Stack(
                      children: [
                        // SVG 图展示区域
                        MenuSvgLayout(
                          menuData: _FireAlarmPageController.menuData,
                          // onMenuItemSelected: (id) {
                          //   // 处理菜单项选中逻辑
                          //   _FireAlarmPageController.onMenuItemSelected(id);
                          // },
                          onMenuItemSelected: (id, {useCache = false}) {
                            _FireAlarmPageController.onMenuItemSelected(id,
                                useCache: true);
                          },
                        ),
                        // 自定义 loading 效果
                        if (_FireAlarmPageController.isLoadingCardTap.value)
                          Container(
                            color: Colors.black.withOpacity(0.5), // 半透明背景
                            child: Center(
                              child: Column(
                                mainAxisAlignment: MainAxisAlignment.center,
                                children: [
                                  SizedBox(
                                    width: 80,
                                    height: 80,
                                    child: Image.asset(
                                        'assets/loading.gif'), // 自定义 loading 动画
                                  ),
                                  SizedBox(height: 16),
                                  Text(
                                    '正在查找报警点...',
                                    style: TextStyle(
                                      fontSize: 16,
                                      color: Colors.white,
                                    ),
                                  ),
                                ],
                              ),
                            ),
                          ),
                      ],
                    );
                  }),
                ),
              ],
            ),
            // 添加弹窗层
            Obx(() {
              if (_FireAlarmPageController.showNoDotAlert.value) {
                return _buildNoDotAlertDialog(context);
              }
              return SizedBox.shrink();
            }),
          ],
        ),
      ),
    );
  }

  // 构建无点位弹窗
  Widget _buildNoDotAlertDialog(BuildContext context) {
    return Center(
      child: Material(
        color: Colors.transparent,
        child: Container(
          width: MediaQuery.of(context).size.width * 0.4,
          padding: EdgeInsets.all(24),
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(16),
            boxShadow: [
              BoxShadow(
                color: Colors.black26,
                blurRadius: 10,
                spreadRadius: 2,
              ),
            ],
          ),
          child: Column(
            mainAxisSize: MainAxisSize.min,
            crossAxisAlignment: CrossAxisAlignment.stretch,
            children: [
              Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Text(
                    '提示',
                    style: TextStyle(
                      fontSize: 20,
                      fontWeight: FontWeight.bold,
                      color: Colors.blue.shade800,
                    ),
                  ),
                  IconButton(
                    icon: Icon(Icons.close, color: Colors.grey),
                    onPressed: () {
                      _FireAlarmPageController.dismissAlert();
                    },
                  ),
                ],
              ),
              SizedBox(height: 16),
              Text(
                _FireAlarmPageController.alertMessage.value,
                style: TextStyle(
                  fontSize: 16,
                  color: Colors.grey.shade800,
                ),
                textAlign: TextAlign.center,
              ),
              SizedBox(height: 24),
              ElevatedButton(
                style: ElevatedButton.styleFrom(
                  backgroundColor: Colors.blue.shade600,
                  shape: RoundedRectangleBorder(
                    borderRadius: BorderRadius.circular(8),
                  ),
                  padding: EdgeInsets.symmetric(vertical: 12),
                ),
                onPressed: () {
                  _FireAlarmPageController.dismissAlert();
                },
                child: Text(
                  '确认',
                  style: TextStyle(
                    fontSize: 16,
                    color: Colors.white,
                  ),
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}
